<!--语义识别结果处理弹框-->
<template>
    <div class="dispose-container" >
        <div class="dispose-title">语义识别</div>
        <div class="close-btn" @click="closeAudioDispose">×</div>
        <ul class="dispose-list">
            <li v-for='(rslt,i) in rslts' v-bind:key="JSON.stringify(rslt)" @click="excuteCmd(JSON.stringify(rslt))">
                <span class="rslt-title">{{ (i+1) + '、' +rslt.command}}</span>
                <span v-if="rslt.score>=70" class="rslt-sc sc-90">匹配度{{ rslt.score }}</span>
                <span v-else-if="rslt.score>=40" class="rslt-sc sc-60">匹配度{{ rslt.score }}</span>
                <span v-else class="rslt-sc sc-0">匹配度{{ rslt.score }}</span>
            </li>
        </ul>
    </div>
</template>

<script>
export default {
  name: 'AudioDispose',
  components: { 
  },
  props: {
    openAudioDisposeHome: {
      type: Function,
      default() {
        false
      }
    },
  },
  data() {
    return {
      isShow: false,
      rslts:[],//识别集合结果
      parames: {},
    }
  },
  created() {
    window.FunList.setAudioDispose = this.setAudioDispose;//设置识别结果
    window.FunList.closeAudioDispose=this.closeAudioDispose;//关闭识别结果处理
    window.FunList.excuteCmdResult=this.excuteCmdResult;//执行识别结果执行命令
  },
  methods: {
    //显示设置识别结果
    setAudioDispose(_rslts){
      let that=this;
      if(_rslts){
        that.rslts=_rslts;
      }

      that.isShow = true;
      // 控制父级弹框
       if(that.openAudioDisposeHome && typeof(that.openAudioDisposeHome) === 'function') {
           that.openAudioDisposeHome(that.isShow)
       }
    },
    // 关闭识别结果弹框
    closeAudioDispose() {
        let that = this
        that.isShow = false
        // 控制父级弹框
        if(that.openAudioDisposeHome && typeof(that.openAudioDisposeHome) === 'function') {
           that.openAudioDisposeHome(that.isShow)
        }
        that.$Cs.closeDetailsPage(10110);
    },
    // 执行识别命令
    excuteCmd(cmdStr){
        let that=this;
        //调用外部接口执行命令
        that.$Ctl.excuteAudioCmdCtl(cmdStr);
    },
  },
}
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.dispose-container{
    overflow: hidden;
    width: 646px;
    height: 486px;
    background: url(../../assets/images/audio/audio-dispose-bg.png) no-repeat;
    opacity:0.9;
}
.dispose-title{
    width:120px;
    height:27px;
    font-size:27px;
    font-family:PingFang SC;
    font-weight:600;
    color:#00AEFF;
    line-height:100px;
    float:left;
    margin-left:64px;
    margin-top:25px;
}
.close-btn{
    cursor: pointer;
    float:left;
    color:#52A7F9;
    width: 38px;
    height:38px;
    margin-top:47px;
    margin-left:375px;
    font-size:38px;
}
.close-btn:hover{
    color:#63BDF1;
}
ul{
    float:left;
    margin-left: 35px;
    margin-top:17px;
    width:577px;
    height:337px;
    font-family:PingFang SC;
    font-weight:400;
}
ul li {
    cursor: pointer;
    width:577px;
    height:56px;
    color:rgba(163,190,221,1);
    padding-top:13px;
    padding-left:29px;
    padding-right:25px;
    font-weight:400;
}
ul li:hover{
    background:rgba(33,98,165,0.4);
    color:#00AEFF;
}
ul li .rslt-title{
    width:300px;
    font-size:22px;
    font-weight:400;
}
ul li .rslt-sc{
    float:right;
    width:135px;
    height:56px;
    padding-top:2px;
    font-size:18px;
    text-align: right;
    margin-right: 4px;
    font-weight:550;
}
.sc-90{
    color:rgba(98,167,138,1);
}
.sc-60{
    color:rgba(203,142,71,1);
}
.sc-0{
    color:rgba(176,55,79,1);
}
</style>